<div class="tabPanel" data-dojo-attach-point="ellipseContainer">
    <div class="controls">
        <div class="controlGroup">
            <label>${nls.ellipseTypeLabel}</label>
            <div class="controlItem">
                <select style="width: 225px" data-dojo-type="dijit/form/Select" data-dojo-attach-point="ellipseType">
                    <option value="semi">${nls.ellipseSemiLabel}</option>
                    <option value="full">${nls.ellipseFullLabel}</option>
                </select>
            </div>
        </div>
        <div class="controlGroup">
            <label data-dojo-attach-point="coordInputLabel">${nls.centerPointLabel}</label>
            <div class="controlItem">
                <input class="jimu-input coordInput" data-dojo-attach-point="startPointCoords" placeholder="${nls.startPointPlaceHolderLabel}" />
                <div class="controlItem paddedLeft">
                    <div class='add-with-icon'>
                        <span title="${nls.formatInputLabel}" class="jimu-icon settingBtn" data-dojo-attach-point="coordinateFormatButton"></span>
                    </div>
                    <div class='add-with-icon'>
                        <div title="${nls.drawEllipseLabel}" class="drawPointBtn" data-dojo-attach-point="addPointBtn"></div>
                    </div>
                </div>
            </div>
            <div class="controlGroup">
                <input class="interactive-checkbox" type="checkbox" data-dojo-attach-point="interactiveEllipse" />
                <label data-dojo-attach-point="interactiveLabel">${nls.createEllipseInteractively}</label>
            </div>
        </div>
        <fieldset>
            <legend>${nls.axisLabel}</legend>
            <div class="controlGroup" data-dojo-attach-point="majorAxisInputDiv">
                <label data-dojo-attach-point="majorAxisLabel">${nls.majorRadiusLabel}</label>
                <div class="controlItem">
                    <input data-dojo-type="dijit/form/NumberTextBox"
                      required='true',
                      value='100',
                      data-dojo-props="constraints:{min:1}"
                      data-dojo-attach-point="majorAxisInput" />
                </div>
            </div>
            <div class="controlGroup" data-dojo-attach-point="minorAxisInputDiv">
                <label data-dojo-attach-point="minorAxisLabel">${nls.minorRadiusLabel}</label>
                <div class="controlItem">
                    <input data-dojo-type="dijit/form/NumberTextBox"
                      required='true',
                      value='50',
                      data-dojo-props="constraints:{min:1}"
                      data-dojo-attach-point="minorAxisInput" />
                </div>
            </div>
            <div class="controlGroup">
                <label>Unit</label>
                <div class="controlItem">
                    <select style="width: 183px" data-dojo-type="dijit/form/Select" id="lengthUnitDD" data-dojo-attach-point="lengthUnitDD">
                        <option value="feet">${nls.units.feet}</option>
                        <option value="kilometers" selected="selected">${nls.units.kilometers}</option>
                        <option value="miles">${nls.units.miles}</option>
                        <option value="meters">${nls.units.meters}</option>
                        <option value="nautical-miles">${nls.units.nauticalMiles}</option>
                        <option value="yards">${nls.units.yards}</option>
                    </select>
                </div>
            </div>
        </fieldset>
        <div class="controlGroup">
            <label>${nls.orientationLabel}</label>
            <div class="controlItem" data-dojo-attach-point="angleInputDiv">
                <input data-dojo-type="dijit/form/NumberTextBox"
                  style="width: 150px"
                  required='true',
                  value='0',
                  data-dojo-props="constraints:{min:0, max:360}"
                  data-dojo-attach-point="angleInput" />
                <select style="width: 100px" class="controlSpace" data-dojo-type="dijit/form/Select" id="angleUnitDD" data-dojo-attach-point="angleUnitDD">
                    <option value="degrees">${nls.degreesLabel}</option>
                    <option value="mils">${nls.milsLabel}</option>
                </select>
            </div>
        </div>
        <div class="controlGroup" >
          <l  abel class="warning">${nls.warningMessage}</label>
        </div>

        <div class="buttonContainer">
            <div class='jimu-btn jimu-state-disabled' data-dojo-attach-point='okButton' data-dojo-attach-event="onclick: okButtonClicked">${nls.common.ok}</div>
            <div class='jimu-btn' data-dojo-attach-point='clearGraphicsButton'>${nls.clearGraphicsLabel}</div>
        </div>
    </div>
</div>

